<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml">

<head>
    <title>广告管理</title>
    <link href="/js/bstable/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/js/bstable/css/bootstrap-table.css" rel="stylesheet" type="text/css">
    <link href="/css/table.css" rel="stylesheet" type="text/css">

    <script src="/js/vue.js"></script>
    <script src="/js/axios.min.js"></script>

    <script src="js/jquery/jQuery-2.2.0.min.js"></script>
    <script src="js/bstable/js/bootstrap.min.js"></script>
    <script src="js/bstable/js/bootstrap-table.js"></script>
    <script src="js/bstable/js/bootstrap-table-zh-CN.min.js"></script>
    <script src="js/layer_v2.1/layer/layer.js"></script>
</head>

<body style="background-color: #ecf0f5;font-family: 微软雅黑;color: #475059;min-width: 1000px;overflow: auto">
<div id="app">
    <div class="notice_main">
        <div class="notice_check">
            <div class="l_left">
                <form class="form-inline" action="/ad/list" method="post">
                    <select  v-model="admin_id" class="form-control" name="admin_id">
                        <option value="0">---请选择管理员---</option>
                        <option v-for="admin in admininfo" v-bind:value="admin.admin_id" >
                            {{admin.admin_name}}
                        </option>
                    </select>
                    <input type="text" v-model="title" name="adTitle" class="form-control" placeholder="请输入广告标题">
                    <button type="button" @click="queryAd" class="btn btn-primary">查询</button>
                </form>
            </div>

        </div>

    <div><br><br></div>
        <table class="table table-bordered  table-hover">
        <tr>
            <th>序号</th>
            <th>广告位置</th>
            <th>广告标题</th>
            <th>广告图片</th>
            <th>广告链接</th>
            <th>操作人</th>
            <th>操作时间</th>
            <th>操作</th>
        </tr>
        <tr v-for="(item,index) in adList">
            <td>{{index+1}}</td>
            <td>{{item.location}}</td>
            <td>{{item.title}}</td>
            <td>{{item.picture}}</td>
            <td>{{item.link}}</td>
            <td>{{item.admin_name}}</td>
            <td>{{item.posted}}</td>
            <td> <a   @click="updateAd(item.ad_id)">修改</a>|<a   @click="delAd(item.ad_id)">删除</a> </td>
        </tr>
    </table>
</div>
</div>
</body>
</html>

<script>
    new Vue({
        el:"#app",
        data:{
            admin_id:0,
            title:'',
            admininfo:[],
            adList:[]
        },
        methods:{
            queryAd:function (){
                _this = this
                // 查询学生信息
                axios.get('/ad/list',{
                    params: {
                        adTitle:this.title,
                        admin_id:this.admin_id,
                    }
                }).then(function (response) {
                    _this.adList=response.data;
                    console.log(response.data);
                })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            updateAd: function (ad_id) {
                // alert(ad_id)
                window.localStorage.setItem("sid", ad_id);
                location.href = "adv_update.html"
            },
            delAd: function (ad_id){
                alert(ad_id)
                window.localStorage.setItem("sid", ad_id);
                location.href="adv.html"
                axios.get('/ad/del',{
                    params:{
                        ad_id: ad_id
                    }
                }).then(function (response){
                    console.log(response.data);
                })
                    .catch(function (error){
                        console.log(error);
                    });
            }
        },
        mounted() {
            _this = this
            //查询公告标题信息
            axios.get('/ad/list',{
                params: {
                    adTitle:this.title,
                    admin_id:this.admin_id,
                }
            }).then(function (response) {
                _this.adList=response.data;
                console.log(response.data);
            })
                .catch(function (error) {
                    console.log(error);
                });
            // 查询发布人信息
            axios.get('/admin/list')
                .then(function (response) {
                    _this.admininfo=response.data;
                    console.log(_this.admininfo);
                })
                .catch(function (error) {
                    console.log(error);
                });
        }
    })
</script>